<!DOCTYPE html>

<html>
<head>
	<link rel="stylesheet" href="../themes/nokia/base.css" type="text/css" media="screen" title="no title" charset="utf-8">
	
	<link rel="stylesheet" href="../themes/custom-theme/ui.all.css" type="text/css" media="screen" title="no title" charset="utf-8">

	<script src="../../lib/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>

	<script src="../../lib/Guarana.js" type="text/javascript" charset="utf-8"></script>

	<style type="text/css" media="screen">
		body {
			font-size: 14px;
			font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
		}

		#drag {
			padding: 20px;
			position: absolute;
			top: 20px; left: 100px;
			cursor: move;
		}
	</style>

</head>

<body>

<div id="drag" class="ui-widget-header ui-corner-all">Drag-me!</div>

<script type="text/javascript" charset="utf-8">

	jQuery(document).ready(function() {

		var drag = new Nokia.Drag({
			element: '#drag'
		});

	});

</script>

</body>
</html>
